<template>
    <div class="content">
        <h2>评价权限设置</h2>
        <el-form
            ref="ruleFormRef"
            :model="ruleForm"
            label-width="120px"
            class="demo-ruleForm"
            :size="formSize"
            status-icon
        >
        <el-form-item label="班主任权限：" prop="type1">
            <el-checkbox-group v-model="ruleForm.type1">
                <el-checkbox label="班主任可见班级内其他老师发布的评语" name="type1" />
            </el-checkbox-group>
            </el-form-item>
            <el-form-item label="评价发起权限：" prop="type">
            <el-checkbox-group v-model="ruleForm.type">
                <el-checkbox label="班主任（评价任教班主任级的学生）" name="type" />
                <el-checkbox label="任课老师（评价任教内班级的学生）" name="type" />
                <el-checkbox label="指导老师（评价全校学生，如巡逻老师）" name="type" />
            </el-checkbox-group>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="onSubmit">确定</el-button>
    </el-form-item>
        </el-form>
    </div>
    
  </template>
  
  <script lang="ts" setup>
  import { useRouter } from 'vue-router'
  import { reactive, ref } from 'vue'
import type { FormInstance, FormRules } from 'element-plus'

const formSize = ref('default')
const ruleFormRef = ref<FormInstance>()
const ruleForm = reactive({
  type1: [],
  type: [],
})
  var router = useRouter()
  // do not use same name with ref
  const form = reactive({
    parents: '',
    students: '',
    type: '',
    date2: '',
    confirm: '',
  })
  
  const onSubmit = () => {
    console.log('submit!')
  }
  </script>
    
  <style scoped>
.content{
    padding: 40px 260px;
}
  </style>